<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>wangEditor2 test</title>
    <link rel="stylesheet" type="text/css" href="../dist/css/wangEditor.min.css">
    <style type="text/css">
        #div1 {
            width: 100%;
            height: 300px;
        }

        .container {
            position: relative;
        }

        .wangEditor-container .wangEditor-txt blockquote {
            display: block;
            border: 1px solid #003399;
            border-left: 8px solid #003399;
            padding: 5px 10px;
            margin: 10px 0;
            line-height: 1.4;
            font-size: 100%;
            background-color: #fff;
        }

        .wangEditor-container .wangEditor-txt table {
            border: none;
            border-collapse: collapse;
        }

        .wangEditor-container .wangEditor-txt table td,
        .wangEditor-container .wangEditor-txt table th {
            border: 1px solid #003399;
            padding: 3px 5px;
            min-width: 50px;
            height: 20px;
        }

        .wangEditor-container .wangEditor-txt pre {
            border: 1px solid #003399;
            background-color: #fff;
            padding: 10px;
            margin: 5px 0px;
            font-size: 0.8em;
            border-radius: 3px;
        }

    </style>
</head>
<body style="padding:0 20px;">
<p>wangEditor2.0.0 自定义编辑区域内容的样式</p>
<div class="container">
    <div id="div1">
        <!-- <textarea id="div1"> -->
        <h3>标题标题1</h3>
        <blockquote><p>请输入内容222</p></blockquote>
        <p><a href="#">链接链接</a></p>
        <pre style="max-width:100%;overflow-x:auto;"><code>var a = 'a';
var b = 'b';</code></pre>
        <p>请输入内容</p>

        <table>
            <tr>
                <td>#</td>
                <td>姓名</td>
                <td>年龄</td>
            </tr>
            <tr>
                <td>1</td>
                <td>zhang</td>
                <td>20</td>
            </tr>
            <tr>
                <td>2</td>
                <td>wang</td>
                <td>30</td>
            </tr>
            <tr>
                <td>3</td>
                <td>lee</td>
                <td>40</td>
            </tr>
        </table>
        <!-- </textarea> -->
    </div>
</div>
<p>底部test</p>


<script type="text/javascript" src="../dist/js/lib/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="../dist/js/wangEditor.js"></script>
<script type="text/javascript">
    $(function () {
        var editor = new wangEditor('div1');
        editor.create();
    });
</script>
</body>
</html>